const path = require('path');
const { VueLoaderPlugin } = require('vue-loader')
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');

 module.exports = {
	mode: "development",
	devtool: 'inline-source-map',
	entry: './src/main.js',	
  output: {
    filename: '[name].bundle.js',
    path: path.resolve(process.cwd(), 'public'),
  },	
	module: {
		rules: [
			{
			  test: /\.js?$/,
			  loader: 'babel-loader',
				exclude: file => (
					/node_modules/.test(file) &&
					!/\.vue\.js/.test(file)
				)
			},
			{
			  test: /\.pug$/,
			  loader: 'pug-plain-loader'
			},
			{
				test: /\.vue$/,
				loader: 'vue-loader'
			},
			{
				test: /\.(png|jpe?g|gif)$/i,
				use: [
					{
						loader: 'file-loader',
					} 
				]
			},
			{
				test: /\.scss$/,
				use: [
					'vue-style-loader',
					'css-loader',
					'sass-loader'
				]
			},
			{
				test: /\.html$/i,
				loader: 'html-loader',
			},
		]
	},
	plugins: [
	  // 请确保引入这个插件！
		new CleanWebpackPlugin(),
	  new VueLoaderPlugin(),
		new HtmlWebpackPlugin({
			title: 'Custom template',
			// Load a custom template (lodash by default)
			template: 'src/index.html',
			publicPath: './'
		})
			//, template: 'index.html'
			// {inject: 'body', template: 'index.html'}
		
	]
	
}
